<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
		"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<title>dijit.Tree Automatic Tests</title>

	<style type="text/css">
		@import "../../dojo/resources/dojo.css";
		@import "../../dojo/resources/dnd.css";
		@import "../../dojo/tests/dnd/dndDefault.css";
		@import "css/dijitTests.css";
	</style>

	<!-- required: a default dijit theme: -->
	<link id="themeStyles" rel="stylesheet" href="../../dijit/themes/tundra/tundra.css">

	<!-- required: dojo.js -->
	<script type="text/javascript" src="../../dojo/dojo.js"
		djConfig="parseOnLoad: true, isDebug: true"></script>

	<!-- not needed, for testing alternate themes -->
	<script type="text/javascript" src="_testCommon.js"></script>

	<script type="text/javascript" src="helpers.js"></script>

	<script language="JavaScript" type="text/javascript">
		dojo.require("doh.runner");
		dojo.require("dijit.dijit"); // optimize: load dijit layer
		dojo.require("dojo.data.ItemFileWriteStore");
		dojo.require("dijit.Tree");
		dojo.require("dijit.tree.ForestStoreModel");
		dojo.require("dijit.tree.dndSource");

		dojo.addOnLoad(function(){
			doh.register("Tree tests",
				[
					function create(){
						var d = new doh.Deferred;
			 			myStore = new dojo.data.ItemFileWriteStore({url:'_data/countries.json'});
			 			doh.t(myStore, "store created");

						myModel = new dijit.tree.ForestStoreModel({
							store: myStore,
							query: {type:'continent'},
							rootId: "earth",
							rootLabel: "Earth",
							childrenAttrs: ["children"]
						});
						doh.t(myModel, "model created");

						myTree = new dijit.Tree({
							id: "myTree",
							model: myModel,
							persist: false,		// persist==true is too hard to test
							dndController: "dijit.tree.dndSource"
						});
						doh.t(myTree, "tree created");

						dojo.byId("container").appendChild(myTree.domNode);
						myTree.startup();

						setTimeout(d.getTestCallback(function(){
							// Give the tree time to load, and the do checks that it
							// loaded correctly
							doh.t(myTree.rootNode, "root node exists");
							doh.t(myTree.rootNode.isExpanded, "root node is expanded");

							var children = myTree.rootNode.getChildren();
							doh.is(6, children.length, "six children");
							doh.is("Africa", children[0].label, "first child");
							doh.f(children[0].isExpanded, "first child not expanded");
							doh.is("South America", children[5].label, "last child");

							// Last child has special CSS for drawing the grid lines
							doh.f(dojo.hasClass(children[3].domNode, "dijitTreeIsLast"), "middle node doesn't have dijitTreeIsLast");
							doh.t(dojo.hasClass(children[5].domNode, "dijitTreeIsLast"), "last node has dijitTreeIsLast");
						}), 750);
						return d;
					},

					function createWithPath(){
						var d = new doh.Deferred;
						myTree2 = new dijit.Tree({
							id: "myTree2",
							model: myModel,
							persist: false,		// persist==true is too hard to test
							dndController: "dijit.tree.dndSource",
							path: ["earth", "EU", "IT"]
						});
						doh.t(myTree2, "myTree2 created");

						dojo.byId("container2").appendChild(myTree2.domNode);
						myTree2.startup();

						setTimeout(d.getTestCallback(function(){
							// Give the tree time to load, and the do checks that it
							// loaded correctly

							doh.t(myTree2.rootNode, "root node exists");
							doh.t(myTree2.rootNode.isExpanded, "root node is expanded");
							doh.t(myTree2.rootNode.getChildren()[3].isExpanded, "europe node is expanded");
							doh.is(myTree2.rootNode.getChildren()[3].getChildren()[3], myTree2.lastFocused, "focused correct node");
						}), 750);
						return d;
					},

					function copyPath(){
						var d = new doh.Deferred;

						myTree.attr("path", myTree2.attr("path"));

						setTimeout(d.getTestCallback(function(){
							doh.t(myTree.rootNode.isExpanded, "root node is expanded");
							doh.t(myTree.rootNode.getChildren()[3].isExpanded, "europe node is expanded");
							doh.is(myTree.rootNode.getChildren()[3].getChildren()[3], myTree.lastFocused, "focused correct node");
						}), 500);

						return d;
					},

					{
						name: "copyPathByIds",
						timeout: 5000,
						runTest: function(){
							var d = new doh.Deferred;

							myTree.attr("path", ["earth", "NA", "CA", "Ottawa"]);

							setTimeout(d.getTestErrback(function(){
								var path = dojo.map(myTree.attr("path"), function(item){ return myTree.model.getIdentity(item); });
								doh.is(["earth", "NA", "CA", "Ottawa"], path, "path got set on myTree")
								myTree2.attr("path", path);

								setTimeout(d.getTestCallback(function(){
									doh.t(myTree2.rootNode.isExpanded, "root node is expanded");
									doh.t(myTree2.rootNode.getChildren()[4].isExpanded, "north america node is expanded");
									doh.t(myTree2.rootNode.getChildren()[4].getChildren()[1].isExpanded, "canada node is expanded");
									doh.is(myTree2.rootNode.getChildren()[4].getChildren()[1].getChildren()[0], myTree2.lastFocused, "focused correct node");
								}), 500);
							}), 500);

							return d;
						}
					},

					function itemUpdate(){
						// Test that Tree noticed when data store items change, and updates accordingly

						var item = myTree.rootNode.getChildren()[3].item;
						myStore.setValue(item, "name", "EU");

						doh.is("EU", innerText(myTree.rootNode.getChildren()[3].labelNode), "label changed");
					},

					function topLevelItemDelete(){
						// Delete a top level item.   ForestStoreModel needs to realize that the top level
						// children have changed and notify Tree

						// Remove "South America"
						var item = myTree.rootNode.getChildren()[5].item;
						myStore.deleteItem(item);

						var children = myTree.rootNode.getChildren();
						doh.is(5, children.length, "five children");
						doh.is("North America", children[4].label, "last child");
						doh.t(dojo.hasClass(children[4].domNode, "dijitTreeIsLast"),
								"North america has become the last node so it gets the CSS class for that");
					},

					function openANode(){
						var d = new doh.Deferred;

						var asia = myTree.rootNode.getChildren()[1];

						doh.is(0, asia.getChildren().length, "no children loaded yet");

						myTree._onExpandoClick({node: asia});

						setTimeout(d.getTestCallback(function(){
							// Give the tree time to load the children, and the do checks that it
							// loaded correctly

							var children = asia.getChildren();
							doh.is(4, children.length, "four children");
							doh.is("China", children[0].label, "first child");
							doh.is("Mongolia", children[3].label, "last child");
						}), 750);
						return d;
					},

					function selectANode(){
						var d = new doh.Deferred;

						myTree.attr('selectedItem','CN');

						// On IE it takes a little time for the attr('selectedItem', ...) to
						// take effect because it calls node.focus() which takes time.
						setTimeout(d.getTestCallback(function(){
							doh.is('CN',myTree.model.getIdentity(myTree.attr('selectedItem')));
						}), 250);

						return d;
					},

					function nestedItemDelete(){
						// Delete a nested item

						// Remove "China"
						var asia = myTree.rootNode.getChildren()[1],
							china = asia.getChildren()[0];
						myStore.deleteItem(china.item);

						var children = asia.getChildren();
						doh.is(3, children.length, "three children");
					},

					function topLevelItemInsert(){
						// Create a new top level item as last child.
						// ForestStoreModel needs to realize that the top level children have changed and notify Tree.

						myStore.newItem({
							id: 'PA',
							name:'Pacifica',
							type:'continent',
			        		children: []
						});

						var children = myTree.rootNode.getChildren();
						doh.is(6, children.length, "six children");
						doh.is("Pacifica", children[5].label, "last child");
						doh.f(dojo.hasClass(children[4].domNode, "dijitTreeIsLast"),
							"North America no longer last child");
						doh.t(dojo.hasClass(children[5].domNode, "dijitTreeIsLast"),
							"Pacifica is last child");
					},


					function destroyTree(){
						// Just running this to make sure we don't get an exception
						console.log("destroying tree");
						myTree.destroy();
 						myTree2.destroy();
					}

				]
			);

			doh.run();
		});
	</script>

</head>
<body class="tundra">

	<h1 class="testTitle">Dijit.Tree automated tests</h1>
	<div id="container"> <!--  tree will go here --></div>
	<div id="container2"> <!--  tree2 will go here --></div>
</body>
</html>




